<!DOCTYPE html>
<html>
  <head>
    <title>giscloud代码生成器</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="/static/images/favicon.ico"/>
    <link rel="bookmark" href="/static/images/favicon.ico"/>
    <link rel="stylesheet" href="/static/plugins/layui/css/layui.css" />
    <link rel="stylesheet" href="/static/plugins/layui/css/modules/formSelects-v4.css" />
    <link rel="stylesheet" href="/static/plugins/treetable/1.0/index.css" />
  </head>
  <body>
    <div class="layui-fluid" style="margin-top: 10px;">
      <div class="layui-row">
        <div class="layui-col-md7">
          <div class="layui-form layui-form-pane">
          <div class="layui-form-item">
            <label class="layui-form-label">数据库</label>
            <div class="layui-input-block">
              <select name="database" id="database"  xm-select="select6_3" xm-select-skin="normal">
              </select>
            </div>
          </div>
          </div>
        </div>
       <div class="layui-col-md5">
          <button type="button" class="layui-btn layui-btn layui-btn-normal refresh"><i class="layui-icon">&#x1002;</i>查询</button>
          <button type="button" class="layui-btn layui-btn-normal add"><i class="layui-icon">&#xe608;</i>生产代码</button>
        </div>
      </div>
      <table class="layui-table layui-form" id="tree-table" lay-size="sm"></table>
    </div>
    <script id="Layer-Add-Template" type="text/html">
      <form class="layui-form" lay-filter="Layer-Add-Form" style="margin-top: 20px;">
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">父项目名称</label>
            <div class="layui-input-inline">
              <input type="text" name="parentProjectName" lay-verify="required|parentProjectName" class="layui-input" placeholder="如：giscloud-yun-parent"/>
            </div>
          </div>
        </div>
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">子项目名称</label>
            <div class="layui-input-inline">
              <input type="text" name="projectName" lay-verify="required|projectName" class="layui-input" placeholder="如：giscloud-api"/>
            </div>
          </div>
        </div>
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">包名路径</label>
            <div class="layui-input-inline">
              <input type="text" name="packageName" lay-verify="required|packageName" class="layui-input" placeholder="如：com.giscloud"/>
            </div>
          </div>
        </div>
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">模块名称</label>
            <div class="layui-input-inline">
              <input type="text" name="moduleName" lay-verify="required|moduleName" class="layui-input" placeholder="如：api"/>
            </div>
          </div>
        </div>
        <div class="layui-form-item" pane="">
          <label class="layui-form-label">引用组件</label>
          <div class="layui-input-block">
            <input type="checkbox" name="rocketmq" lay-skin="primary" title="rocketmq" value="rocketmq">
            <input hidden type="checkbox" name="execel" lay-skin="primary" title="execel" value="execel">
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">redis缓存</label>
          <div class="layui-input-block">
            <input type="radio" name="redis" lay-filter="redis" value="redis,standalone" title="单机模式">
            <input type="radio" name="redis" lay-filter="redis" value="redis,cluster" title="集群模式">
            <input type="radio" name="redis" lay-filter="redis" value="redis,sentinel" title="哨兵模式">
          </div>
        </div>
        <div class="layui-form-item" pane="">
          <label class="layui-form-label">分布式事物</label>
          <div class="layui-input-block">
            <input type="checkbox" name="dts" lay-skin="primary" title="支持"  value="dts">
          </div>
        </div>
        <div class="layui-form-item" pane="">
          <label class="layui-form-label">前端代码</label>
          <div class="layui-input-block">
            <input type="checkbox" name="front" lay-skin="primary" title="生成"  value="front">
          </div>
        </div>
        <div class="layui-form-item">
          <div class="layui-input-block" style="margin-left: 170px;">
            <button type="button" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="AddSubmit">确定</button>
            <button type="button" class="layui-btn layui-btn-primary" onclick="formClose()">取消</button>
          </div>
        </div>
      </form>
    </script>
    <script src="/static/plugins/layui/layui.js"></script>
    <script src="/static/plugins/layui/lay/modules/formSelects-v4.min.js"></script>
    <script type="text/javascript">
      layui.config({
        base: './static/plugins/layui/lay/modules/'
      });
      layui.use(['treeTable', 'layer', 'form', 'laytpl'], function () {
        var $ = layui.$
        ,treeTable = layui.treeTable
        ,layer = layui.layer
        ,form = layui.form
        ,laytpl = layui.laytpl;
          var formSelects = layui.formSelects;
          var re = treeTable.render({
          elem: '#tree-table'
          ,url: '/sys/generator/listDatabases' //数据接口 data参数和url二选一
          ,icon_key: 'tableName'
          ,is_checkbox: true
          ,id: 'listReload'
          ,end: function (e) {
            form.render();
            layer.closeAll();
           }
          ,cols: [
            {
              key: 'tableName'
              ,title: '表名'
              ,width: '400px'
              ,template: function (item) {
                if (item.level == 0) {
                  return '<span style="color:red;">' + item.tableName + '</span>';
                } else if (item.level == 1) {
                  return '<span style="color:green;">' + item.tableName + '</span>';
                } else if (item.level == 2) {
                  return '<span style="color:#aaa;">' + item.tableName + '</span>';
                }
              }
              ,align: 'left'
            }
            ,{
                key: 'id'
                ,title: 'ID'
                ,width: '100px'
                ,align: 'center'
            }
            ,{
                key: 'pid'
                ,title: '父ID'
                ,width: '100px'
                ,align: 'center'
            }
            ,{
                 key: 'createTime'
                ,title: '创建时间'
                ,width: '200px'
                ,align: 'center'
            }
            ,{
                key: 'comments'
                ,title: '备注'
                ,align: 'center'
            }
          ]
        });
        //顶部工具栏点击-获取选中值，返回值是一个数组（定义的primary_key参数集合）
        $('.get-checked').click(function () {
          layer.msg('选中参数' + treeTable.checked(re).join(','));
        });
        //顶部工具栏点击-添加数据
        $('.add').click(function () {
          var $content = '<div id="Layer-Add-View"></div>';
            var $count = treeTable.checked(re).length;
            if($count == 0){
                layer.msg('请选择数据库');
                return;
            }
          var index = layer.open({
            type: 1
            ,title: '项目信息'
            ,area: ['550px', '600px']
            ,content: $content
            ,success: function(layero, index) {
              //var $data = data.item; //模版数据
              var $index_Template = $('#Layer-Add-Template').html(); //模版
              var $index_View = $('#Layer-Add-View'); //视图
              var $All_Dir = new Array(); //获取所有主目录
              layui.each(re.data, function (array, object) {
                if (object.pid == 0) { //一级目录
                  $All_Dir.push(object);
                }
              });
              laytpl($index_Template).render($All_Dir, function(html) {
                $index_View.html(html); //渲染视图
              });
              form.render();
              form.on('submit(AddSubmit)', function (data) { //监听提交
                  var $data = new Array(); //需要修改的数据或数组 如下方dates示例
                  $data.push(data.field);
                  var checkValues = [];
                  $(".layui-input-block input").each(function(){
                      if(true == $(this).is(':checked')){
                          checkValues.push($(this).val());
                      }
                  });
                  var tableNames = treeTable.checkedValues(re);
                  location.href = "sys/generator/codess?tables=" + tableNames+"&parentProjectName="+data.field.parentProjectName+"&projectName="+data.field.projectName+"&packageName="+data.field.packageName+"&moduleName="+data.field.moduleName+"&checkValues="+checkValues.join(",");
                  layer.close(index); //关闭弹窗
                   return false; //阻止表单跳转
               });
            }
          });
            window.formClose = function(){
                layer.close(index);     //执行关闭
            }
        });
        var radiovalue ;
        form.on('radio(redis)',function (data) {
           if(radiovalue===data.elem.value){
               $(data.elem).prop('checked', false);
               radiovalue=''
           }else{
               $(data.elem).prop('checked', true)
               radiovalue=data.elem.value
           }
            form.render();
            return false;
          });
          //顶部工具栏点击-重载列表
        $('.refresh').click(function () {
            //获取下拉选中的值
            var selectIds = formSelects.value('select6_3', 'val');
            if(selectIds.length == 0){
                layer.msg('请选择数据库进行查询');
                return;
            }
            var loading = layer.msg('正在加载数据......', {icon: 16, shade: 0.3, time:0});
            var params ="";
            selectIds.forEach( function(item){
                params +="databaseId="+item+"&";
            } )
            re.url="/sys/generator/listDatabases?"+params
            treeTable.render(re);
        });
        //顶部工具栏点击-全部展开
        $('.open-all').click(function () {
          treeTable.openAll(re);
        });
        //顶部工具栏点击-全部关闭
        $('.close-all').click(function () {
          treeTable.closeAll(re);
        });

          $(function () {
              //select6_3为下拉选项xm- select="select6_3"对应，形如：dom元素的ID
              layui.formSelects.render('select6_3', {
                //init: ["1", "请先选择机构"],              //默认值

                  skin: "normal", //多选皮肤normal|primary|default|danger|warm

                  height: "auto",                //是否固定高度, 38px | auto

                  radio: false,                  //是否设置为单选模式

                  direction: "down",        //显示方式向下显示

                  on: function(id, vals, val, isAdd, isDisabled){

                  },            //同formSelects.on

                  searchType: "dl"    //搜索框的位置

              });

              layui.formSelects.data('select6_3', 'server', {

                  type:'post',

                  url: '/sys/database/select',

                  header: {'Authorization': parent.authValue},

                  success: function(id, url, searchVal, result){


                  }

              });
          });
      });
    </script>
  </body>
</html>
